<template>
	<div>
		<div class='prizeDrawSpace'>
	
		</div>
	<div class="prizeDraw">
		<div class="prizeDraw_top">
			<div class="prizeDraw_top_close">
				<div class class="prizeDraw_top_close_left">
					<image src="@/static/image/left.png" mode="" @click="backEvent()"></image>
				</div> 推送记录 <image src="@/static/image/close.png" mode="" class="closeImg" @click="closeDialog()"></image>
			</div>
			<scroll-view @scrolltolower="scrolltolower" :style="{height:scrollViewHeight+'rpx'}" :scroll-y="true"
				:scroll-with-animation="true">
				<div class="prizeDraw_user_item" v-for="(ite,idx) in activityPageList" :key='idx'>
					<div class='prizeDraw_user_item_top'>

						<div v-if="ite.status === 1" class="prizeDraw_user_item_top_left_btn_one">进行中</div>
						<div v-else-if="ite.status === 2"
							class="prizeDraw_user_item_top_left_btn_one_act prizeDraw_user_item_top_left_btn_one">已失效
						</div>

						<div v-else>-</div>
						<div
							:class="ite.type == 2?'prizeDraw_user_item_top_left_btn_two prizeDraw_user_item_top_left_btn_two_act':'prizeDraw_user_item_top_left_btn_two' ">
							{{ite.coupon.typeStr}}
						</div>
						<div class='prizeDraw_user_item_top_title ex'>
							{{ite.coupon.name}}
						</div>
					</div>
					<!-- 	<div class="prizeDraw_items_cont_items">
						<div class="prizeDraw_items_cont_items_left">
							红包总金额：¥<div class="prizeDraw_items_cont_items_cont ex">{{ite.prizeName}}</div>
						</div>
					</div> -->

					<div class="prizeDraw_items_cont_items">
						<div class="prizeDraw_items_cont_items_left">
							发放数量：<div class="prizeDraw_items_cont_items_left_a ex">{{(ite.total)}}
							</div>
						</div>
						<div class="prizeDraw_items_cont_items_left textRight">
							已领取：<div class="prizeDraw_items_cont_items_left_a ex ">
								{{ ite.recvedNum }}
							</div>
						</div>
					</div>
					<div class="prizeDraw_items_cont_items">

						<div class="prizeDraw_items_cont_items_left timeCont">
							开奖时间：<div class="prizeDraw_items_cont_items_left_a ex ">{{ite.createTime}}
							</div>
						</div>
					</div>
					<div class="prizeDraw_items_cont_items_btn">
					<!-- 	<div :class="ite.status == 2?'prizeDraw_items_btn_act prizeDraw_items_btn_acts':'prizeDraw_items_btn_act' "
							@click='activityInvalidEvent(ite,idx)'>
							失效
						</div> -->

						<div class="prizeDraw_items_cont_items_btn_text" @click='deleteEvent(ite)'>
							删除
						</div>
					</div>
				</div>
				<div class="listSpace" v-if="activityPageList.length <= 0 && loading">
					<list-space></list-space>
				</div>


				<div class="zj_space">

				</div>


			</scroll-view>
		</div>
	</div>
	</div>
</template>

<script>
	export default {
		filters: {
			formatDate(v) {
				const value = v * 1000
				const data = new Date(value);
				const month = data.getMonth() + 1;
				const day = data.getDate();
				const year = data.getFullYear();
				const hours = data.getHours();
				const minutes = data.getMinutes();
				const seconds = data.getSeconds();
				const formattedTime = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
				return formattedTime;
			}
		},
		data() {
			return {
				params: {
					page: 1,
					pageSize: 10,
					liveId: '1801513352929742848'
				},
				activityPageList: [],
				scrollViewHeight: 812,
				total: 0,
				Amount: 0, //余额
				loading: false
			}
		},
		onLoad(opt) {
			if (opt.liveId) {
				this.params.liveId = opt.liveId || this.liveId
			}
			this.getActivityList()

		},
		onPullDownRefresh() {
			this.activityPageList = []
			this.params.page = 1
			this.loading = false
			this.getActivityList()
		},
		methods: {
			closeDialog(){
				this.$utils.closeDialog(this)
				// uni.navigateBack()
			},
			// 失效activityInvalid
			activityInvalidEvent(ite, idx) {
				uni.showModal({
					title: '提示',
					content: '失效后已领取该优惠劵的用户将无法使用该优惠劵，是否确认失效？',
					success: async (res) => {
						console.log('res', res)
						if (res.confirm) {
							// drawActivityId: "1801106215296569344"
							const {
								data
							} = await this.$request(this.$Api.activityInvalid, {
								id: ite.id
							}, "POST")
							if (data.code !== 200) return
							// 执行软修改
							this.activityPageList[idx].status = 2
						}
					}
				})
			},
			// 删除后不可恢复，不可查看活动信息，是否要删除活动
			deleteEvent(ite, idx) {
				uni.showModal({
					title: '提示',
					content: '删除后将无法恢复该优惠券您确定删除吗?',
					success: async (res) => {
						console.log('res', res)
						if (res.confirm) {
							// drawActivityId: "1801106215296569344"
							const {
								data
							} = await this.$request(this.$Api.activityDelete, {
								id: ite.id
							}, "POST")
							if (data.code !== 200) return
							// 执行软删除
							this.activityPageList.splice(idx, 1)
							uni.showToast({
								title: '操作成功',
								icon: 'none'
							})

						}
					}
				})
			},
			// 失效后已领取该优惠劵的用户将无法使用该优惠劵，是否确认失效？
			scrolltolower(e) {
				if (this.activityPageList.length < this.total) {
					this.params.page++
					this.getActivityList()
				} else {
					uni.showToast({
						title: '已到底',
						icon: 'none'
					})
				}
				console.log('e.detail.scrollTop', e.detail.scrollTop)
			},
			async getActivityList() {
				const {
					data
				} = await this.$request(this.$Api.activityList, this.params, "get")
				this.loading = true
				if(data.code!=200)return
				if(!data.data.list) return
				this.activityPageList = this.activityPageList.concat(data.data.list)
				this.total = data.data.total
				uni.stopPullDownRefresh()
			},
			// 中奖名单
			winnersEvemt(ite) {

			},
			// 查看红包记录
			receveEvent(ite) {
				uni.navigateTo({
					url: '/pages/redPacket/RedEnvelopeCollectionRecord?redName=' + ite.desc + '&redPacketId=' + ite
						.redPacketId
				})
			},
			backEvent() {
				uni.navigateBack()
			},
			// 发红包
			sendRed() {
				uni.navigateTo({
					url: '/pages/redPacket/sendRedPacket?liveId=' + this.params.liveId
				})
			}
		}
	}
</script>

<style lang="scss">
	.prizeDraw {
		width: 100%;
		height: 992rpx;
		background: #FFFFFF;
		border-radius: 16rpx 16rpx 0rpx 0rpx;
		overflow-y: hidden;
		// position: fixed;
		bottom: 0;
		left: 0;
		padding: 0 32rpx;
		box-sizing: border-box;
		color: #464C5B;
		font-size: 28rpx;

		.prizeDraw_top {
			width: 100%;
			height: 100rpx;
			position: relative;
			text-align: center;
			font-size: 32rpx;
			line-height: 100rpx;

			.prizeDraw_top_close {}


			.prizeDraw_top_close_left {
				position: absolute;
				left: 0;
				top: 10rpx;
				width: 44rpx;
				height: 44rpx;

				image {
					width: 100%;
					height: 100%;
				}
			}


			.closeImg {
				position: absolute;
				right: 0;
				top: 32rpx;
				width: 32rpx;
				height: 32rpx;
			}

		}

		.prizeDraw_top_title {
			width: 100%;
			height: 80rpx;
			font-size: 28rpx;
			color: #464C5B;
			text-align: left;
			font-weight: 500;
			line-height: 80rpx;
		}

		.prizeDraw_user_item {
			width: 100%;
			margin: auto;
			// height: 310rpx;
			background: #F6F9FF;
			border-radius: 8rpx;
			margin-bottom: 20rpx;
		}

		.prizeDraw_user_item_top {
			width: 100%;
			height: 80rpx;
			border-bottom: 1rpx solid #D7DDE4;
			display: flex;
			justify-content: flex-start;
			padding: 0 24rpx;
			box-sizing: border-box;
			align-items: center;
			font-size: 24rpx;
			color: #fff;

			.prizeDraw_user_item_top_left_btn_one {
				width: 104rpx;
				height: 46rpx;
				background: #00C795;
				border-radius: 8rpx;
				line-height: 46rpx;
				text-align: center;
				margin-right: 16rpx;

			}

			.prizeDraw_user_item_top_left_btn_one_act {
				background: #BFBFBF;
			}

			.prizeDraw_user_item_top_left_btn_two {
				min-width: 128rpx;
				height: 46rpx;
				background: #2B9CFF;
				border-radius: 8rpx;
				padding: 0 16rpx;
				box-sizing: border-box;
				line-height: 46rpx;
				margin-right: 16rpx;
			}

			.prizeDraw_user_item_top_left_btn_two_act {
				background: #FF5A5F;
			}

			.prizeDraw_user_item_top_title {
				width: 360rpx;
				color: #464C5B;
				text-align: left;

			}

		}

		.prizeDraw_items_cont_items {
			display: flex;
			align-items: center;
			justify-content: space-between;
			height: 40rpx;
			margin-top: 20rpx;
			padding: 0 24rpx;
			box-sizing: border-box;
			font-size: 24rpx;

			color: #8C8C8C;

			.prizeDraw_items_cont_items_left {
				width: 100%;
				display: flex;
				align-items: center;


				.color_blue {
					color: #295EFF;
				}

				.prizeDraw_items_cont_items_left_a {
					color: #464C5B;

				}

				.prizeDraw_items_cont_items_cont {
					width: 480rpx;
					text-align: left;
					color: #464C5B;
				}

			}

			.timeCont {
				min-width: 380rpx;

			}

			.textRight {
				text-align: right;
				justify-content: flex-end;

			}

		}

		.prizeDraw_items_cont_items_btn {
			height: 80rpx;
			display: flex;
			align-items: center;
			justify-content: flex-end;
			padding: 0 20rpx;
			box-sizing: border-box;

			image {
				width: 28rpx;
				height: 28rpx;
			}

			.prizeDraw_items_btn_act {
				min-width: 112rpx;
				height: 48rpx;
				background: #295EFF;
				border-radius: 8rpx;
				font-size: 24rpx;
				color: #fff;
				text-align: center;
				line-height: 48rpx;

				pa span {
					margin-left: 10rpx;
				}
			}

			.prizeDraw_items_btn_acts {
				opacity: 0.5;
			}

			.prizeDraw_items_cont_items_btn_text {
				width: 96rpx;
				height: 34rpx;
				font-family: PingFangSC, PingFang SC;
				font-weight: 400;
				font-size: 24rpx;
				color: #295EFF;
				line-height: 34rpx;
				text-align: left;
				font-style: normal;
				margin-left: 32rpx;

			}
		}




	}
</style>
